<template>
	<view>
		<!-- 顶部自定义导航 -->
		<tn-nav-bar fixed>
			直播列表
		</tn-nav-bar>
		<view :style="{paddingTop: vuex_custom_bar_height + 'px'}" class="search-conten">
			<preview-list :dataList="liveData" @refreshLive="refreshLive"></preview-list>
			<tn-empty style="position: fixed;left: 50%; transform: translateX(-50%);top:40%" mode="list"
				v-if="liveData.length == 0"></tn-empty>
		</view>
	</view>
</template>

<script>
	import {
		getLiveList
	} from '@/util/index.js'
	export default {
		data() {
			return {
				page: 1,
				limit: 200,
				liveData: [],
				orderType: 0,
				liveTypeId: '',
				tagId: ''
			};
		},
		onLoad(option) {
			if (option.liveTypeId) {
				this.liveTypeId = option.liveTypeId
				this.tagId = option.tagId
			}
			this.getList()
		},
		methods: {
			getList() {
				getLiveList({
					page: this.page,
					limit: this.limit,
					liveTypeId: this.liveTypeId || '',
					tagId: this.tagId || ''
				}).then((res) => {
					this.liveData = res.list
				}).catch(() => {

				})
			},
		},
	}
</script>

<style lang="less">
	.search-conten {}

	.search-box {
		display: flex;
		width: 100%;
		align-items: center;
		padding: 20rpx 20rpx;
		position: fixed;
		z-index: 11111;
		background-color: #FFFFFF;

		.search-input {
			padding: 0 40rpx;
			font-size: 34rpx;
			flex: 1;
			background-color: #eeeeee;
			border-radius: 40rpx;
			margin-right: 20rpx;
		}

		.search-btn {
			background-color: #FFFFFF;
			width: 150rpx;
			text-align: center;
			height: 70rpx;
			line-height: 70rpx;
			background-color: #01BEFF;
			color: #FFFFFF;
			border-radius: 20rpx;
		}
	}

	.search-tab {
		width: 100%;
		// padding: 20rpx 20rpx;
		position: fixed;
		z-index: 11111;
		background-color: #eeeeee;
	}

	.load-more {
		padding: 20rpx;
	}
</style>
